<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML>

<ui:composition xmlns="http://www.w3c.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core"
	template="/templates/principal.xhtml">
	
	<!-- <ui:param name="title" value="#{msg.title_sistema}"/> -->

	<ui:define name="conteudo">
		<h:panelGroup>
			<div class="row-fluid">
				<div class="span12">
					<h:form id="formVeiculo">
						<fieldset>
								<legend>Dados do Veiculo</legend>
								<div class="row">
								
									<div class="span3">
										<h:outputLabel value="#{msg['veiculo.marca']}" for="marca">
											<h:outputText value="  *" style="color:red"/>
										</h:outputLabel>
										<p:selectOneMenu value="#{veiculoBean.marca.id}" id="marca"  style="width:100%">
											<f:selectItem itemLabel="Selecione" itemValue="" />
											<f:selectItems value="#{veiculoBean.marcas}"  var="marca" itemLabel="#{marca.nome}" itemValue="#{marca.id}" />
											<p:ajax update="modelo,anoVersao,versao" listener="#{veiculoBean.buscarModelos}" />
										</p:selectOneMenu>
									</div>
									<div class="span3">
										<h:outputLabel value="#{msg['veiculo.modelo']}" for="modelo"  style="width:100%">
											<h:outputText value="  *" style="color:red"/>
										</h:outputLabel>
										<p:selectOneMenu value="#{veiculoBean.veiculo.modelo.id}" id="modelo" style="width:100%">
											<f:selectItem itemLabel="Selecione" itemValue="" />
											<f:selectItems value="#{veiculoBean.modelos}" var="modelo" itemLabel="#{modelo.nome}" itemValue="#{modelo.id}"/>
											<p:ajax update="versao" listener="#{veiculoBean.buscarVersoes}" />
										</p:selectOneMenu>
									</div>
								
									<div class="span3">
										<h:outputLabel value="#{msg['veiculo.versao']}" for="versao">
											<h:outputText value="  *" style="color:red"/>
										</h:outputLabel>
										<p:selectOneMenu value="#{veiculoBean.versao.id}" id="versao" style="width:100%">
											 <f:selectItem itemLabel="Selecione" itemValue="" />
											 <f:selectItems value="#{veiculoBean.versoes}"  var="versao" itemLabel="#{versao.nome}" itemValue="#{versao.id}"/>
											 <p:ajax update="anoVersao,versao" listener="#{veiculoBean.buscarAnoVersao}" />
										</p:selectOneMenu>
									</div>
								</div>
								<br />	
								<div class="row">	
									<div class="span3">
										<h:outputLabel value="#{msg['veiculo.ano_versao']}" for="anoVersao">
											<h:outputText value="  *" style="color:red"/>
										</h:outputLabel>
										<p:selectOneMenu value="#{veiculoBean.anoVersao.id}" id="anoVersao" style="width:100%">
											 <f:selectItem itemLabel="Selecione" itemValue="" />
											 <f:selectItems value="#{veiculoBean.anosVersao}"  var="anoVersao" itemLabel="#{anoVersao.ano}" itemValue="#{anoVersao.id}"/>
											 <p:ajax update="anofabricacao" listener="#{veiculoBean.buscarAnoFabricacao}" /> 
										</p:selectOneMenu>
									</div>
									<div class="span3">
										<h:outputLabel value="#{msg['veiculo.ano_fabricacao']}" for="anofabricacao">
											<h:outputText value="  *" style="color:red"/>
										</h:outputLabel>
										<p:selectOneMenu value="#{veiculoBean.anoFabricacao}" id="anofabricacao" style="width:100%">
											 <f:selectItem itemLabel="Selecione" itemValue="" />
	    	    		 					 <f:selectItems value="#{veiculoBean.anosFabricacao}"/>
											<f:selectItems/>
										</p:selectOneMenu>
								   </div>	
	<!--							   
								   <h:outputLabel value="#{msg['veiculo.ano_fabricacao']}" for="anofabricacao">
									<h:outputText value="  *" style="color:red"/>
								</h:outputLabel>
								<p:selectOneMenu value="#{veiculoBean.anoFabricacao}" id="anofabricacao">
									 <f:selectItem itemLabel="Selecione" itemValue="" />
									<f:selectItems value="#{veiculoBean.anosFabricacao}"/>
								</p:selectOneMenu> -->
								   
									
									<div class="span3">
										<h:outputLabel value="#{msg['veiculo.cor']}" for="cor">
											<h:outputText value="  *" style="color:red"/>
										</h:outputLabel>
										<p:selectOneMenu value="#{veiculoBean.veiculo.cor}" id="cor" style="width:100%">
											 <f:selectItem itemLabel="Selecione" itemValue="" />
											<f:selectItems value="#{veiculoBean.cores}" itemValue="#{veiculoBean.veiculo.cor}"/>
										</p:selectOneMenu>
									</div>
								</div>
						<div class="row">
							<div class="span3">
								<h:outputLabel value="#{msg['veiculo.placa']}" for="placa">
									<h:outputText value="  *" style="color:red"/>
								</h:outputLabel>
								<p:inputText value="#{veiculoBean.placa}" id="placa" maxlength="7" styleClass="span3" style="width:100%"/>
							</div>
						
							<div class="span3">
								<h:outputLabel value="#{msg['veiculo.quilometragem']}" for="quilometragem">
									<h:outputText value="  *" style="color:red"/>
								</h:outputLabel>
								<p:inputText value="#{veiculoBean.anuncio.quilometragem}" id="quilometragem" styleClass="span3" style="width:100%"/>
							</div>
							<div class="span2">
								<h:outputLabel value="#{msg['veiculo.gas']}" for="gas">
									<h:outputText value=" " style="color:red"/>
								</h:outputLabel>
								<p:selectBooleanCheckbox value="#{veiculoBean.gas}" id="gas" styleClass="span2"/>
							</div>
						<div class="row">
							<div class="span2">
								<h:outputLabel value="#{msg['veiculo.unico_dono']}" for="unicodono">
									<h:outputText value=" " style="color:red"/>
								</h:outputLabel>
								<p:selectBooleanCheckbox value="#{veiculoBean.unicoDono}" id="unicodono" styleClass="span3" />
							</div>
						</div>
						</div>
						</fieldset>
						<div class="row">
							<div class="span6">
								<fieldset>
									<!-- <legend>#{msg['veiculo.acessorios']}</legend> -->
									<legend>Acessorios/Opcionais</legend>
									<p:pickList id="acessorios" value="#{veiculoBean.acessorios}" var="acessorio" itemLabel="#{acessorio}" itemValue="#{acessorio}" />
								</fieldset> 
							</div>
						</div>
						<div class="row">
							<div class="span6">
								<fieldset>
									<!-- <legend>#{msg['veiculo.acessorios']}</legend> -->
									<legend>Imagens</legend>
									<p:pickList id="acessorios2" value="#{veiculoBean.acessorios}" var="acessorio" itemLabel="#{acessorio}" itemValue="#{acessorio}" />
								</fieldset> 
							</div>
						</div>
						<br />
						<fieldset>
							<legend>Dados para Contato</legend>
							<div class="row">
								<div class="span2">
									<h:outputLabel value="#{msg['veiculo.uf']}" for="uf">
											<h:outputText value="  *" style="color:red"/>
									</h:outputLabel>
									<p:selectOneMenu value="#{veiculoBean.estado.id}" id="uf" style="width: 100%" panelStyle="span2">
											<f:selectItem itemLabel="PB" itemValue="25" />
											<f:selectItem itemLabel="PE" itemValue="26"/>
											<f:selectItems value="#{veiculoBean.estados}"  var="estado" itemLabel="#{estado.sigla}" itemValue="#{estado.id}" />
											<p:ajax update="cidade" listener="#{veiculoBean.buscarCidades}" />
									</p:selectOneMenu>
								</div>
								<div class="span3">
									<h:outputLabel value="#{msg['veiculo.cidade']}" for="cidade">
											<h:outputText value="  *" style="color:red"/>
									</h:outputLabel>
									<p:selectOneMenu value="#{veiculoBean.cidade.id}" id="cidade" style="width: 100%;" panelStyle="span4">
										<f:selectItem itemLabel="#{veiculoBean.estado.capital}"></f:selectItem>
										<f:selectItems value="#{veiculoBean.cidades}" var="cidade" itemLabel="#{cidade.nome}" itemValue="#{cidade.id}"/>
									</p:selectOneMenu>
								</div>
							</div>
							<div class="row">
								<div class="span4">
									<h:outputLabel value="#{msg['veiculo.telefone1']}" for="telefone1" >
										<h:outputText value="  *" style="color:red"/>
									</h:outputLabel>
									<p:inputText value="#{veiculoBean.anuncio.telefone1}" id="telefone1" styleClass="span4" style="width:100%"/>
								</div>
								<div class="span4">
									<h:outputLabel value="#{msg['veiculo.telefone2']}" for="telefone2">
										<h:outputText value="  *" style="color:red"/>
									</h:outputLabel>
									<p:inputText value="#{veiculoBean.anuncio.telefone2}" id="telefone2" styleClass="span4" style="width:100%"/>
								</div>
							</div>
						</fieldset>
						<br />
						<br />
						<div class="row">
								<div class="span4">
									<h:outputLabel value="#{msg['veiculo.preco']}" for="preco">
										<h:outputText value="  *" style="color:red"/>
									</h:outputLabel>
									<p:inputText value="#{veiculoBean.anuncio.preco}" id="preco"  styleClass="span2" style="width:100%"/>
								</div>
						</div>
						<br />
						<br />
						<div class="row">
							<div class="span4">
								<h:outputLabel value="#{msg['veiculo.informacoes_adicionais']}" for="informacoes_adicionais">
									<h:outputText value="  *" style="color:red"/>
								</h:outputLabel>
								<p:inputTextarea id="informacoes_adicionais" rows="5" cols="30" value="#{veiculoBean.anuncio.descricao}" counter="counter" maxlength="100" counterTemplate="#{msg['veiculo.caracteres_restantes']}" autoResize="false"/>  
								<h:outputText id="counter" />
							</div>
						</div>
						<br />
						<p:commandLink value="Upload das Imagens" onclick="dialogUpload.show()"/>
							
						<div class="row">
							<div class="span12">
								<p:commandButton value="Cadastrar" action="#{veiculoBean.cadastrar}"/>
								<p:commandButton value="Cancelar"/>
							</div>
						</div>
						<p:dialog id="modalDialog" header="Importar Imagens" widgetVar="dialogUpload" modal="true" height= "564" width= "700">  
	  						<h:form>  
	  
							    <p:fileUpload fileUploadListener="#{veiculoBean.upload}" mode="advanced" dragDropSupport="false"  
							                  update="messages" sizeLimit="1000000" fileLimit="3" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" 
							                  cancelLabel="Cancelar" label="Escolher" uploadLabel="Importar"/>  
							  
							    <p:growl id="messages" showDetail="true"/>  
							  
							</h:form>   
								
							
						</p:dialog>
						
					</h:form>
				</div>
			</div>
		</h:panelGroup>
	</ui:define>
</ui:composition>